import 'package:baselib/utils/image_util.dart';
import 'package:baselib/utils/log_util.dart';
import 'package:baselib/widgets/comm_app_bar.dart';
import 'package:baselib/widgets/gradient_card_view.dart';
import 'package:baselib/widgets/inkwell_button.dart';
import 'package:baselib/widgets/online_status.dart';
import 'package:baselib/widgets/refresh_util.dart';
import 'package:flutter/material.dart';
import 'package:framelib/config/api_config.dart';
import 'package:framelib/utils/color_util.dart';
import 'package:framelib/utils/drawable_util.dart';
import 'package:framelib/utils/px_util.dart';
import 'package:framelib/widgets/page_widget.dart';
import 'package:get/get.dart';
import 'package:module_business/module_index/model/index_room_item_entity.dart';
import 'package:module_business/module_index/model/voice_chat_tag_entity.dart';
import 'package:module_business/module_index/viewmodel/index_tag_view_model.dart';
import 'package:module_business/module_index/viewmodel/index_view_model.dart';

/**
 * tag主页
 */
class IndexTagPage extends GetWidget<IndexTagViewModel> {
  VoiceChatTagEntity voiceChatTag;
  IndexTagPage({Key key,this.voiceChatTag}) : super(key: key) {}
  @override
  Widget build(BuildContext context) {
    Get.put(IndexTagViewModel(voiceChatTag:voiceChatTag),tag: '${voiceChatTag?.id}');
    return PageWidget.build(
        tag: '${voiceChatTag?.id}',
        builder: (IndexTagViewModel model) {
      return RefreshUtil.init(
        model.refreshController,
            ()=>model.onRefresh(pageCur: model?.page=1),
            ()=>model.onRefresh(pageCur: model?.page+1),
        _buildListUi(model),
        physics: ClampingScrollPhysics(),
        loadStatus: model?.loadStatus,
        enablePullDown: true,
        enablePullUp: false,
        isCanMoreData: model?.isCanMoreData??true,
        onReFreshFunction:()=>model.onRefresh(pageCur: model?.page=1),
      );
    });
  }

  Widget _buildListUi(IndexTagViewModel model) {
    return GridView.builder(
        // shrinkWrap: true,
        cacheExtent: (PxUtil.instance.screenWidth-PxUtil.instance.px_10*2-PxUtil.instance.px_10)/2,
        padding: EdgeInsets.only(
          left: PxUtil.instance.px_10,
          right: PxUtil.instance.px_10,
          top: PxUtil.instance.px_10,
          bottom: PxUtil.instance.px_10,
        ),
        gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
            crossAxisCount: PxUtil.instance.px_2.toInt(),
            mainAxisSpacing:PxUtil.instance.px_10,
            crossAxisSpacing: PxUtil.instance.px_10,
            childAspectRatio: PxUtil.instance.px_1
        ),
        itemCount: model.dataLists?.length??0,
        itemBuilder: (BuildContext context, int index) {
          var dataItem = model.dataLists[index];
          return  GestureDetector(
            onTap: ()=>model.toRoom(index),
            child: _buildItemUi(model,dataItem),
          );
        }
        );
  }
  _buildItemUi(IndexTagViewModel model,IndexRoomItemEntity dataItem){
    return Container(
      width: (PxUtil.instance.screenWidth-PxUtil.instance.px_10*2-PxUtil.instance.px_10)/2,
      height: (PxUtil.instance.screenWidth-PxUtil.instance.px_10*2-PxUtil.instance.px_10)/2,
      child: Stack(
        children: [
          // ImagesUtil.loadImage(
          //   dataItem?.backgroundImg,
          //   width: (PxUtil.instance.screenWidth-PxUtil.instance.px_10*2-PxUtil.instance.px_10)/2,
          //   height: (PxUtil.instance.screenWidth-PxUtil.instance.px_10*2-PxUtil.instance.px_10)/2,
          //   radius: BorderRadius.circular(PxUtil.instance.px_8)
          // ),
          ImagesUtil.loadNetworkImage(
              ApiConfig.getOssImgUrl(dataItem?.coverImg),
              width: (PxUtil.instance.screenWidth-PxUtil.instance.px_10*2-PxUtil.instance.px_10)/2,
              height: (PxUtil.instance.screenWidth-PxUtil.instance.px_10*2-PxUtil.instance.px_10)/2,
              radius: BorderRadius.circular(PxUtil.instance.px_8)
          ),
          //名称
          Positioned(
            left: PxUtil.instance.px_9,
            top: PxUtil.instance.px_10,
            child:Row(
              children: [
                GradientCardView(
                    elevation: PxUtil.instance.px_0,
                    height: PxUtil.instance.px_14,
                    margin: EdgeInsets.only(),
                    padding: EdgeInsets.only(
                      left: PxUtil.instance.px_10,
                      right: PxUtil.instance.px_10,
                    ),
                    borderWidth: PxUtil.instance.px_0d5,
                    borderRadius: BorderRadius.circular(PxUtil.instance.px_8),
                    gradient: LinearGradient(
                        begin: Alignment.topCenter,
                        end: Alignment.bottomCenter,
                        colors: [
                          ColorUtil.instance.color_half_AD2CF1,
                          ColorUtil.instance.color_half_7776FF,
                        ]
                    ),
                    alignment: Alignment.center,
                    child: Text(
                      dataItem?.roomName,
                      style: TextStyle(
                        color: ColorUtil.instance.color_white,
                        fontSize: PxUtil.instance.px_8,
                      ),
                    )
                )
              ],
            )
          ),
          //热度
          Positioned(
            right: PxUtil.instance.px_9,
            top: PxUtil.instance.px_10,
            child: Row(
              children: [
                ImagesUtil.loadImage(
                  DrawableUtil.instance.icon_index_hot,
                  width: PxUtil.instance.px_10
                ),
                Container(
                  margin: EdgeInsets.only(
                    top: PxUtil.instance.px_1,
                    left: PxUtil.instance.px_2
                  ),
                  child: Text(
                    '${dataItem?.charismaShow??0}',
                    style: TextStyle(
                      color: ColorUtil.instance.color_EF0A6A,
                      fontSize: PxUtil.instance.px_11
                    ),
                  ),
                )
              ],
            )
          ),
          //说明
          (dataItem?.roomSynopsis??'').isEmpty?SizedBox(width: PxUtil.instance.px_0,):
          Positioned(
              left: PxUtil.instance.px_9,
              bottom: PxUtil.instance.px_10,
              child:Row(
                children: [
                  GradientCardView(
                      elevation: PxUtil.instance.px_0,
                      height: PxUtil.instance.px_14,
                      margin: EdgeInsets.only(),
                      padding: EdgeInsets.only(
                        left: PxUtil.instance.px_10,
                        right: PxUtil.instance.px_10,
                      ),
                      borderWidth: PxUtil.instance.px_1,
                      borderRadius: BorderRadius.circular(PxUtil.instance.px_8),
                      gradient: LinearGradient(
                          begin: Alignment.topCenter,
                          end: Alignment.bottomCenter,
                          colors: [
                            ColorUtil.instance.color_half_transparent,
                            ColorUtil.instance.color_half_transparent,
                          ]
                      ),
                      alignment: Alignment.center,
                      child: Text(
                        dataItem?.roomSynopsis??'',
                        style: TextStyle(
                          color: ColorUtil.instance.color_white,
                          fontSize: PxUtil.instance.px_8,
                        ),
                      )
                  )
                ],
              )
          ),
        ],
      ),
    );
  }

}
